.tool-bar-wrapper {
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
    height: 90rpx;
    box-sizing: content-box;

    .tool-bar {
        z-index: 9;
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 90rpx;
        border-top: 1rpx solid #eee;
        box-shadow: 0 0 4rpx #f5f5f5;
        background-color: #fff;
        display: flex;
        justify-content: space-between;
        align-items: center;
        overflow: hidden;
        color: rgb(127, 136, 155);
        box-sizing: content-box;
        padding-bottom: constant(safe-area-inset-bottom);
        padding-bottom: env(safe-area-inset-bottom);

        .bar-tool-left {
            margin-left: 30rpx;
            height: 60rpx;
            flex: 1;

            .virtual-input {
                padding: 0 30rpx;
                height: 60rpx;
                line-height: 60rpx;
                font-size: 24rpx;
                border-radius: 60rpx;
                background-color: #efefef;
            }
        }

        .bar-tool {
            margin-left: 20rpx;
            text-align: center;

            .tool-item {
                vertical-align: top;
                display: inline-block;
                width: 80rpx;
                margin: 0 2rpx;

                &-icon {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    height: 48rpx;

                    .icon {
                        font-size: 40rpx;
                    }

                    &.is-checked {
                        color: var(--color-theme);
                    }
                }

                &-count {
                    height: 32rpx;
                    line-height: 28rpx;
                    font-size: 24rpx;
                }
            }
        }
    }
}